(webgl required)
Got a call today about a cool ThreeJS job that I need to do some R&D for. The skills needed for an MVP are:
Had some technical hurdles I didn't quite get the time to get through, but hopefully I have a good baseline to work from tomorrow after getting through a lot of setup garbage. I think I learned something though. At least ThreeJS is behaving, so hopefully I'll get to checking off those list items tomorrow.
Success!First thing crossed off the todo list (aka moveable camera). Go ahead click, scroll, etc... It was super duper easy once I finally found the problem. Turns out that the way I have this project structured is a little abnormal and I'm still not 100% sure that things are installed "correctly" but at least they are installed "functionally"
Makes me excited to keep on working on the next part (I might even add a task for instancing, but I might wait untill i have the most minimum mvp just to have my bases covered.
Since I spent basically all day at work doing particle stuff (including some pretty cool TD on shading particles based on their proximity to other particles which I'll have to make a tutorial about some day) I thought I'd go ahead and see about creating particles here.
Once again the trickiest part was just getting things to behave in the context of this mess of a site, but it didn't take too long to troubleshoot. I would work more on this, but I'm probably going to hop back in houdini land and see if I can come up with one more look for work stuff.
Also looks like Particles in Three JS work basically just like I thought they would which will make it pretty simple in that other work project I have yet to meet about. I'm pretty psyched to see how much further I can push this after doing some deeper reading!
Started working on the interactive section of this. I had some revisions come in for work so, once again, my OAD took a little hit, but now when you click on one of the little react icons, AND it's close enough in z space to you it will turn all of them red, but if it's too far away it will turn green. Pretty good first step into the main functionality and it looks like it won't be too too difficult to add and read attributes to and from points to create procedural links.
Easier day at work today so back in ThreeJS land. Actually this was more just basic web Javascript, but still pretty fun. Now when you click on one of the little react icons it takes you to a random page on the website. Since I have 2 different URL schemes some pages don't work, but later I will try and parse my posts and then assign their metadata as a point attribute (you can do that in Houdini so you should be able to do it here too and the inspector makes it look like there might be something like that available). I may need to change from creating vertices to actual geometry or individual materials or something like that, but I'm not opposed to that course of action either.
Late bonus addition! Now the cursor changes to a pointer when you hover over a 3d element! Detecting hover will let us do all sorts of other fun interactions later on!
Doesn't look like there's much progress, but under the hood a whole lot happened! Now we are able to keep the points as instanced / buffer geometry and still read attributes from them on click! It's a little weird since the attributes are actually in a seperate array, but it can be accessed via the index so I'm a happy camper! Right now there are just post IDs stored in each point (so if you click on the same point twice it will take you to the same post), but we can store whatever arbitrary data we want alongside individual points now so I'm pretty stoked! I would still like to add some sort of animations, but for now I think I definitely have the approperate start to feel confident going into the meeting tomorrow.
Alright the basics are in place, let's lay out the next set of tasks for this little experiment
Dropped a simple CSS BG in so now we know how to render the scene on Alpha. Not sure which checkbox I'm going to tackle next. But it was nice to have an easy one on my (mostly) off day.
Also for fun I made a new thumbnail for this next section (should I create a new page entierly? I might actually do that tomorrow) I was feeling the resistance strong at the start of this, but now I'm having fun so into houdini land I go for a bit!